// 音乐搜索功能

// DOM元素
const searchInput = document.getElementById('search-input');
const searchBtn = document.getElementById('search-btn');
const searchResults = document.getElementById('search-results');

// 初始化搜索功能
function initSearch() {
    // 为搜索按钮添加点击事件
    searchBtn.addEventListener('click', performSearch);
    
    // 为搜索框添加回车事件
    searchInput.addEventListener('keypress', (event) => {
        if (event.key === 'Enter') {
            performSearch();
        }
    });
    
    // 点击页面其他区域关闭搜索结果
    document.addEventListener('click', (event) => {
        if (!searchResults.contains(event.target) && 
            event.target !== searchInput && 
            event.target !== searchBtn) {
            searchResults.style.display = 'none';
        }
    });
}

// 执行搜索
function performSearch() {
    const searchTerm = searchInput.value.trim().toLowerCase();
    
    if (searchTerm === '') {
        searchResults.style.display = 'none';
        return;
    }
    
    // 通过API从后端搜索音乐
    fetch(`/music/search?q=${encodeURIComponent(searchTerm)}`)
        .then(response => {
            if (!response.ok) {
                throw new Error('搜索失败');
            }
            return response.json();
        })
        .then(results => {
            // 显示搜索结果
            displaySearchResults(results, searchTerm);
        })
        .catch(error => {
            console.error('搜索音乐失败:', error);
            
            // 出错时使用本地搜索作为备用
            const musicData = window.app.getMusicData();
            const results = musicData.filter(music => {
                return music.title.toLowerCase().includes(searchTerm) || 
                       music.artist.toLowerCase().includes(searchTerm);
            });
            
            displaySearchResults(results, searchTerm);
        });
}

// 显示搜索结果
function displaySearchResults(results, searchTerm) {
    // 清空之前的搜索结果
    searchResults.innerHTML = '';
    
    if (results.length === 0) {
        // 没有找到结果时显示提示信息
        const noResultItem = document.createElement('div');
        noResultItem.classList.add('search-result-item', 'no-result');
        noResultItem.innerHTML = `<div class="search-result-info">
            <div class="search-result-title">没有找到与"${searchTerm}"相关的音乐</div>
        </div>`;
        searchResults.appendChild(noResultItem);
    } else {
        // 显示搜索结果列表
        results.forEach(music => {
            const resultItem = document.createElement('div');
            resultItem.classList.add('search-result-item');
            // 处理空艺术家情况
            const displayArtist = music.artist || '未知艺术家';
            
            resultItem.innerHTML = `
                <img src="${music.coverUrl || '../assets/default-cover.svg'}" alt="${music.title} 封面">
                <div class="search-result-info">
                    <div class="search-result-title">${highlightMatch(music.title, searchTerm)}</div>
                    <div class="search-result-artist">${highlightMatch(displayArtist, searchTerm)}</div>
                </div>
            `;
            
            resultItem.addEventListener('click', () => {
                // 查找音乐索引
                const musicData = window.app.getMusicData();
                const index = musicData.findIndex(item => item.id === music.id);
                
                // 播放找到的音乐
                if (index !== -1) {
                    window.app.playMusic(index);
                }
                
                // 关闭搜索结果
                searchResults.style.display = 'none';
                searchResults.classList.remove('show');
            });
            
            searchResults.appendChild(resultItem);
        });
    }
    
    // 显示搜索结果容器并添加动画效果
    searchResults.style.display = 'block';
    // 强制重排以确保动画生效
    void searchResults.offsetWidth;
    // 添加show类以触发动画
    searchResults.classList.add('show');
}

// 高亮显示搜索匹配的文本
function highlightMatch(text, searchTerm) {
    if (!searchTerm || text.toLowerCase().indexOf(searchTerm.toLowerCase()) === -1) {
        return text;
    }
    
    const regex = new RegExp(`(${searchTerm})`, 'gi');
    return text.replace(regex, '<mark>$1</mark>');
}

// 导出公共方法
window.search = {
    init: initSearch
};

// 页面加载完成后初始化搜索功能
window.addEventListener('DOMContentLoaded', search.init);